<template>
  <view>
    <u-navbar :title="title"></u-navbar>
    <view class="webview_height">
      <iframe :src="src" frameborder="0" height="100%" width="100%"></iframe>
    </view>
  </view>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  data() {
    return {
      src: '',
      title: '',
    }
  },
  computed: {
    ...mapGetters({
      userInfo: 'user/getUserInfo',
    }),
  },
  onLoad(option) {
    if (option.hasOwnProperty('url')) {
      let params = {
        viewername: this.userInfo.nick_name,
        viewertoken: option.viewertoken,
        autoLogin: true,
      }
      this.src = atob(option.url) + '&' + this.params(params)
      this.title = '回放'
      return
    } else {
      let params = {
        roomid: option.roomid,
        userid: option.userid,
        viewername: this.userInfo.nick_name,
        viewertoken: option.viewertoken,
        autoLogin: true,
      }
      this.src = 'https://view.csslcloud.net/api/view/index?' + this.params(params)
      this.title = '直播'
    }
  },
  methods: {
    params(obj) {
      let result = ''
      let item
      for (item in obj) {
        if (obj[item] && String(obj[item])) {
          result += `&${item}=${obj[item]}`
        }
      }
      if (result) {
        result = result.slice(1)
      }
      return result
    },
  },
}
</script>

<style lang="scss" scoped>
.webview_height {
  height: calc(100vh - 44px);
  width: 100%;
}
</style>
